<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/vue.min.js"></script>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div id="app">
    <h2>{{news.title}}</h2>
    <div>
        <span>{{news.createTime}} </span>
        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        <span>{{news.author}}</span>        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        <h6>{{news.summary}}</h6>        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        <span style="color: aqua">阅读数:{{news.viewnum}}</span>

        <div>
            <p v-html="news.content.content"></p>
        </div>
    </div>
</div>
</body>
<script>
    var params = window.location.search;
    var s = params.substr(1, params.length);
    var arr = s.split("=");
    var id=arr[1];
    console.log(params);
   var vm= new Vue({
        el: "#app",
        data: {
            news: {}

        },
        methods: {

        },
        mounted(){
            $.ajax({
                url: "http://localhost:8080/news/detail",
                data: {
                    id:id
                },
                success: function (data){
                    vm.news = data;
                },
                error: function (err){
                    alert(err);
                }
            });
        }
    });
</script>
</html>